<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <meta http-equiv="X-UA-Compatible" content="ie=edge">
   <link rel="stylesheet" href="/css/index.css">
   <link rel="stylesheet" href="/libs/font/iconfont.css">
   <title>Meitu美图官网主页面</title>
</head>
<body>
<header></header>
<!-- 轮播图 -->
<div id="carousel">
	<ul>
      <li class="car-li-01">
         <div class="car-info">
            <div class="car-info-detail">
               <img src="/images/carousel01-small.png" alt="">
            </div>
            <a href="">精美配件，立即体验 ></a>
         </div>
      </li>
      <li class="car-li-02">
         <div class="car-info">
            <div class="car-info-detail">
               <img src="/images/carousel02-small.png" alt="">
            </div>
            <a href="">128G仅售1699元 立即抢购 ></a>
         </div>
      </li>
      <li class="car-li-03">
         <div class="car-info">
            <div class="car-info-detail">
               <img src="/images/carousel03-small.png" alt="">
            </div>
            <a href="">128GB | ￥1990 立即购买 ></a>
         </div>
      </li>
    </ul>
    <ol>
       
    </ol>
    <a href="javascript:;" id="goPrev" class="btn" >&laquo;</a>
    <a href="javascript:;" id="goNext" class="btn" >&raquo;</a>
</div>

<!-- main -->
<main>
   <div id="main-goods-list">
      <ul id="categoryList">

      </ul>
      <script type="text/html" id="categoryTemplate">
         {{ each list item }}
         <li>
            <img src="{{ item.src }}"></a>
            <div class="good-desc">
               <p>{{ item.title }}</p>
               <p>{{ item.price }}</p>
            </div>
         </li>
         {{/each}}
      </script>
   </div>
   <div class="more-goods">
      <h3>-----更多优质商品----</h3>
      <div class="list-box"  id="moreGoodsList">
         <!-- <div id="listone">
            <a href=""><img src="" alt=""></a>
            <p></p>
            <p></p>
            <p></p>
         </div> -->
      </div>
      <script type="text/html" id="moreGoodsTemplate"> 
         {{each currData item}}
         <div>
            <a href="/html/goodslist.html#{{item.id}}" ><img src="{{item.src}}" alt="" ></a>
            <p class="p1">{{item.ctitle}}</p>
            <p class="p2">{{item.title.toUpperCase()}}</p>
            <p class="p3">{{item.desc}}</p>
         </div>
         {{/each}}
      </script>
   </div>
   <div class="fen-ye">
      <button id="prevBtn">上一页</button>
      <span id="currPage">
          1
      </span>/
      <span id="allPage">
              10
      </span>
      <button id="nextBtn">下一页</button>
   </div>
</main>

<!-- footer -->
<footer></footer>
</body>
<script src="/libs/requirejs/require.min.js" data-main="/js/index"></script>
</html>